import React, { Component } from 'react';
import {Link} from 'react-router-dom';
import './roomDetail.css';

/**
 * 房子展示普通组件
 */
export class RoomDetail extends Component {
    constructor(props){
        super(props);
        this.state = {
        }
    }
    render() {
        return (
            <Link to="/app/room/index" style={{color:'#555'}}>
                <div className="roomDetail" >
                    <img src={this.props.img} alt="房子"/>
                    <div className="roomDetailText">
                        <p className="roomLike">贵港平价全景楼房，仅需10万</p>
                        <p><span className="theInfo">位置：</span><span>{this.props.address}</span></p>
                        <p><span className="theInfo">价格：</span><span>{this.props.price}</span><span>万/平方米</span></p>
                        <p><span className="theInfo">类型：</span><span>两室一厅</span></p>
                        <p><span className="theInfo">喜欢人数：</span><span>100  </span>
                            <span className="theInfo">浏览人数：</span><span>100</span></p>
                    </div>
                </div>
            </Link>
        );
    }
}

/**
 * 房子推荐组件
 */
export class RoomDetailRecomend extends Component {
    constructor(props){
        super(props);
        this.state = {
        }
    }
    render() {
        return (
            <Link to="/app/room/index" style={{color:'#555'}}>
                <div className="roomDetail" >
                    <img src={this.props.img} alt="房子"/>
                    <div className="roomDetailText">
                        <p><span className="theInfo">位置：</span><span>{this.props.address}</span></p>
                        <p><span className="theInfo">价格：</span><span>{this.props.price}</span><span>万/平方米</span></p>
                        <p><span className="theInfo">类型：</span><span>两室一厅</span></p>
                        <p><span className="roomLike">推荐理由：</span><span>{this.props.recomendText}</span></p>
                    </div>

                </div>
            </Link>
        );
    }
}

/**
 * 房子喜欢或浏览组件
 */
export class RoomDetailLike extends Component {
    constructor(props){
        super(props);
        this.state = {
        }
    }
    render() {
        return (
            <Link to="/app/room/index" style={{color:'#555'}}>
                <div className="roomDetailLike" onClick={this.props.onClick}>
                    <img src={this.props.img} alt="房子"/>
                    <div className="rootDetailLikeText">
                        <p><span className="theInfo">位置：</span><span>{this.props.address}</span></p>
                        <p><span className="theInfo">价格：</span><span>{this.props.price}</span><span>万/平方米</span></p>
                        <p><span className="theInfo">类型：</span><span>两室一厅</span></p>
                    </div>
                </div>
            </Link>
        );
    }
}
// export default RoomDetail;
